<template>
   <view class="panel">
        <!-- 面板的标题 -->
        <view class="panel-title">我的订单</view>
        <!-- 面板的主体 -->
        <view class="panel-body">
            <!-- 面板主体中的 item 项 -->
            <view class="panel-item">
                <image src="/static/my-icons/icon1.png" class="icon"></image>
                <text>待付款</text>
            </view>
            <view class="panel-item">
                <image src="/static/my-icons/icon2.png" class="icon"></image>
                <text>待收货</text>
            </view>
            <view class="panel-item">
                <image src="/static/my-icons/icon3.png" class="icon"></image>
                <text>退款/退货</text>
            </view>
            <view class="panel-item">
                <image src="/static/my-icons/icon4.png" class="icon"></image>
                <text>全部订单</text>
            </view>
        </view>
    </view>
</template>

<script>
   export default {
      data() {
         return {

         };
      },
      onLoad() {

      },
      methods: {

      }
   };
</script>

<style scoped lang='scss'>
    .panel-list {
        padding: 0 10px;
        position: relative;
        top: -10px;
        .panel {
            background-color: white;
            border-radius: 3px;
            margin-bottom: 8px;
            .panel-title {
                line-height: 45px;
                padding-left: 10px;
                font-size: 15px;
                border-bottom: 1px solid #f4f4f4;
            }
            .panel-body {
                display: flex;
                justify-content: space-around;
                .panel-item {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: space-around;
                    font-size: 13px;
                    padding: 10px 0;
                    .icon {
                        width: 35px;
                        height: 35px;
                    }
                }
            }
        }
    }

</style>